import { Canvas, Meta, Source } from '@storybook/blocks'

import * as PaginationStories from './pagination.stories'

<Meta of={PaginationStories} />

# Pagination

Pagination with page navigation, next and previous links.

## Preview

<Canvas of={PaginationStories.Default} />

## Usage

export const importCode = `import {
  Pagination,
  PaginationContent,
  PaginationEllipsis,
  PaginationItem,
  PaginationLink,
  PaginationNext,
  PaginationPrevious,
} from "@orbitkit/ui/pagination";`

export const usageCode = `<Pagination>
  <PaginationContent>
    <PaginationItem>
      <PaginationPrevious href="#" />
    </PaginationItem>
    <PaginationItem>
      <PaginationLink href="#">1</PaginationLink>
    </PaginationItem>
    <PaginationItem>
      <PaginationEllipsis />
    </PaginationItem>
    <PaginationItem>
      <PaginationNext href="#" />
    </PaginationItem>
  </PaginationContent>
</Pagination>
`

<Source code={importCode} language='ts' dark />
<Source code={usageCode} language='tsx' dark />
